<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>克莱特商务云平台</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <!-- bootstrap 3.0.2 -->
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- font Awesome -->
        <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <!-- Ionicons -->
        <link href="css/ionicons.min.css" rel="stylesheet" type="text/css" />
        <!-- Morris chart -->
        <link href="css/morris/morris.css" rel="stylesheet" type="text/css" />
        <!-- jvectormap -->
        <link href="css/jvectormap/jquery-jvectormap-1.2.2.css" rel="stylesheet" type="text/css" />
        <!-- bootstrap wysihtml5 - text editor -->
        <link href="css/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css" rel="stylesheet" type="text/css" />
        <!-- Theme style -->
        <link href="css/AdminLTE.css" rel="stylesheet" type="text/css" />

        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
          <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>

        <div class="wrapper row-offcanvas">
            <!-- Right side column. Contains the navbar and content of the page -->
            <aside >

                <!-- Main content -->
                <section class="content">

                    <!-- Small boxes (Stat box) -->
                    <div class="row">
                        <div class="col-xs-12">
                            <!-- small box -->
                             <div class="box box-solid">
								<div class="col-lg-6" style="text-align: center;">
									<img src="img/car.png" style="height: 300px;text-align: center;"/>
								</div>
                             	<div class="col-lg-6">
	                             	<table style="margin-top: 70px;margin-left: 80px;">
	                             		<tr>
	                             			<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">设备编号：</td>
	                             			<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">160301916080&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
	                             			<td class="knob-label" style="font-size: 15px;color: black;margin-left: 100px;font-weight: 400;">设备名称：</td>
	                             			<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">数控激光切割机</td>
	                             		</tr>
	                             	</table>
	                             	<table style="margin-top: 30px;margin-left: 80px;">
					                    <tr>
											<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">所属厂区：</td>
											<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">南区&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
											<td class="knob-label" style="font-size: 15px;color: black;margin-left: 300px;font-weight: 400;">型号：</td>
											<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">WHKLT-S-JQ-001</td>
	                             		</tr>
	                             	</table>	
	                             	<table style="margin-top: 30px;margin-left: 80px;">
      									<tr>
											<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">设备厂家：</td>
											<td class="knob-label" style="font-size: 15px;color: black;font-weight: 400;">上海团结普瑞玛激光设备有限公司</td>
	                             		</tr>	                             		
	                             	</table>
	                             </div>
                             </div>
                        </div><!-- ./col -->       
           
                    </div><!-- /.row -->
                    
					<div class="row">
					    <div class="col-xs-12">
					        <div class="box box-solid">					           
					            <div class="box-body">
					                <div class="row">
					                    <div class="col-md-3 col-sm-6 col-xs-6 text-center">
					                        <input id='knob_1' type="text" class="knob" value="60" data-skin="tron" data-thickness="0.2" data-width="120" data-height="120" data-max="400" data-fgColor="#3c8dbc"/>
					                        <div class="knob-label" style="font-size: 15px;color: #001F3F;font-weight: 400;">电压</div>
					                    </div><!-- ./col -->
					                    <div class="col-md-3 col-sm-6 col-xs-6 text-center">
					                        <input  id='knob_2' type="text" class="knob" value="60" data-skin="tron" data-thickness="0.2" data-width="120" data-height="120" data-max="50" data-fgColor="#f56954"/>
											<div class="knob-label" style="font-size: 15px;color: #001F3F;font-weight: 400;">电流</div>
					                    </div><!-- ./col -->
					                    <div class="col-md-3 col-sm-6 col-xs-6 text-center">
					                    		<input  id='knob_3' type="text" class="knob" value="60" data-skin="tron" data-thickness="0.2" data-width="120" data-height="120" data-max="5000" data-fgColor="#00a65a"/>
					                        <div class="knob-label" style="font-size: 15px;color: #001F3F;font-weight: 400;">转速</div>
					                    </div><!-- ./col -->
					                    <div class="col-md-3 col-sm-6 col-xs-6 text-center">
						                    	<input  id='knob_4' type="text" class="knob" value="60" data-skin="tron" data-thickness="0.2" data-width="120" data-height="120" data-max="100" data-fgColor="#00c0ef"/>
						                    	<div class="knob-label" style="font-size: 15px;color: #001F3F;font-weight: 400;">进给</div>
					                    </div><!-- ./col -->
					                </div><!-- /.row -->
					            </div><!-- /.box-body -->
					        </div><!-- /.box -->
  							<!-- LINE CHART -->
                            <div class="box box-solid">
                            	   	<div class="box-header">
                                    <h3 class="box-title">运行时间统计</h3>
                                </div>
                                <div class="box-body">
                                    <div class="chart" id="line-chart" style="height: 250px;"></div>
                                </div><!-- /.box-body -->
                            </div><!-- /.box -->			
                            
					    </div><!-- /.col -->
                              
					</div><!-- /.row -->

                </section><!-- /.content -->
            </aside><!-- /.right-side -->
        </div><!-- ./wrapper -->




        <!-- jQuery 2.0.2 -->
        <script src="js/jquery.min.js"></script>
        <!-- jQuery UI 1.10.3 -->
        <script src="js/jquery-ui-1.10.3.min.js" type="text/javascript"></script>
        <!-- Bootstrap -->
        <script src="js/bootstrap.min.js" type="text/javascript"></script>
        <!-- Morris.js charts -->
        <script src="js/raphael-min.js"></script>
        <script src="js/plugins/morris/morris.min.js" type="text/javascript"></script>
        <!-- Sparkline -->
        <script src="js/plugins/sparkline/jquery.sparkline.min.js" type="text/javascript"></script>
        <!-- jvectormap -->
        <script src="js/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js" type="text/javascript"></script>
        <script src="js/plugins/jvectormap/jquery-jvectormap-world-mill-en.js" type="text/javascript"></script>
        <!-- jQuery Knob Chart -->
        <script src="js/plugins/jqueryKnob/jquery.knob.js" type="text/javascript"></script>
        <!-- daterangepicker -->
        <script src="js/plugins/daterangepicker/daterangepicker.js" type="text/javascript"></script>
        <!-- Bootstrap WYSIHTML5 -->
        <script src="js/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js" type="text/javascript"></script>
        <!-- iCheck -->
        <script src="js/plugins/iCheck/icheck.min.js" type="text/javascript"></script>

        <!-- AdminLTE App -->
        <script src="js/AdminLTE/app.js" type="text/javascript"></script>

        <script src="js/plugins/echarts/echarts.js"></script>
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ZUONbpqGBsYGXNIYHicvbAbM"></script>
        <!--<script src="js/plugins/echarts/example.js"></script>-->

        <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
        <!--<script src="js/AdminLTE/dashboard.js" type="text/javascript"></script>-->
        
        <script src="knob.js" type="text/javascript"></script>
        <script src="morris.js" type="text/javascript"></script>

    </body>
</html>

